{% extends "base.html" %}

{% block content %}
<!-- 统计卡片 -->
<div class="stats">
    <div class="stat-card">
        <div class="stat-number">{{ stats.trends_count }}</div>
        <div class="stat-label">总热点数</div>
    </div>
    <div class="stat-card">
        <div class="stat-number">{{ stats.contents_count }}</div>
        <div class="stat-label">生成内容</div>
    </div>
    <div class="stat-card">
        <div class="stat-number">{{ stats.published_count }}</div>
        <div class="stat-label">发布成功</div>
    </div>
</div>

<!-- 最新热点 -->
<div class="content-section">
    <div class="section-header">
        <h2 class="section-title">最新热点</h2>
    </div>
    <div class="section-content">
        {% if latest_trends %}
        <ul class="item-list">
            {% for trend in latest_trends %}
            <li class="item">
                <div>
                    <div class="item-title">{{ trend.title }}</div>
                    <div class="item-meta">
                        来源: {{ trend.source }} | 
                        排名: {{ trend.rank }} | 
                        时间: {{ trend.created_at.strftime('%Y-%m-%d %H:%M') }}
                    </div>
                </div>
                <div>
                    <span class="badge badge-info">{{ trend.source }}</span>
                </div>
            </li>
            {% endfor %}
        </ul>
        {% else %}
        <div class="empty-state">
            <p>暂无热点数据</p>
            <a href="/api/v1/trends/scrape" class="btn btn-primary">立即抓取</a>
        </div>
        {% endif %}
    </div>
</div>

<!-- 最新生成内容 -->
<div class="content-section">
    <div class="section-header">
        <h2 class="section-title">最新生成内容</h2>
    </div>
    <div class="section-content">
        {% if latest_contents %}
        <ul class="item-list">
            {% for content in latest_contents %}
            <li class="item">
                <div>
                    <div class="item-title">{{ content.content[:100] }}{% if content.content|length > 100 %}...{% endif %}</div>
                    <div class="item-meta">
                        平台: {{ content.platform }} | 
                        状态: {{ content.status }} | 
                        时间: {{ content.created_at.strftime('%Y-%m-%d %H:%M') }}
                    </div>
                </div>
                <div>
                    {% if content.status == 'pending' %}
                    <span class="badge badge-warning">待发布</span>
                    {% elif content.status == 'published' %}
                    <span class="badge badge-success">已发布</span>
                    {% else %}
                    <span class="badge badge-info">{{ content.status }}</span>
                    {% endif %}
                </div>
            </li>
            {% endfor %}
        </ul>
        {% else %}
        <div class="empty-state">
            <p>暂无生成内容</p>
        </div>
        {% endif %}
    </div>
</div>

<script>
    // 自动刷新数据
    setTimeout(function() {
        location.reload();
    }, 60000); // 每分钟刷新一次
</script>
{% endblock %}